<extend name="Base/common" />
<block name="body">
	<!--导航引用-->
	<include file="Public/nav" />
	<footer class="ui-footer ui-footer-stable ui-btn-group ui-border-t ui-whitespace">
		<input type="hidden" id="id" value="{$row.id|default=0}" />
		<input type="hidden" id="order_type" value="{$data.order_type|default=no}" />
	    <a href="javascript::" class="ui-btn-lg bt_rtext">保存</a>
	</footer>
	<section class="ui-container">
		<div class="ui-add-address-from">
			<div class="ui-form-item ui-border-b">
	            <label class="ui-border-r">姓名:</label>
	            <input type="text" name="name" id="name" placeholder="请输入姓名" value="{$row.name|default=''}">
	            </a>
	        </div>
	        <div class="ui-form-item ui-border-b">
	            <label class="ui-border-r">电话:</label>
	            <input type="text" name="phone" id="phone" placeholder="请输入电话" maxlength="11" value="{$row.phone|default=''}">
	        </div>
	        <div class="ui-form-item ui-border-b"  id="js_province_box">
	            <label class="ui-border-r">省市：</label>
	            <div class="ui-select">
	                <select id="pro_id" name="pro_id">
	                    <option value="-1">请选择...</option>
						<volist name="list" id="v">
							<option value="{$v.area_id}" <if condition="$row['pro_id'] eq $v['area_id']">selected="selected"</if>>{$v.area_name}</option>
						</volist>
	                </select>
	            </div>
	        </div>
	        <div id="js_city_box" class="ui-form-item ui-border-b" <if condition="$row['city_id'] elt 0">style="display:none;"</if>>
	            <label class="ui-border-r">城市：</label>
	            <div class="ui-select m_select">
	            	<empty name="list_city">
	            		正在加载城市数据...
	            	<else />
		                <select id="city_id" name="city_id">
		                    <option value="-1">请选择...</option>
							<volist name="list_city" id="v">
								<option value="{$v.area_id}" <if condition="$row['city_id'] eq $v['area_id']">selected="selected"</if>>{$v.area_name}</option>
							</volist>
		                </select>
	            	</empty>
	            </div>
	        </div>
	        <div id="js_area_box" class="ui-form-item ui-border-b" <if condition="$row['area_id'] elt 0">style="display:none;"</if>>
	            <label class="ui-border-r">区县：</label>
	            <div class="ui-select m_select">
	            	<empty name="list_area">
	            		正在加载区域数据...
	            	<else />
		                <select id="area_id" name="area_id">
							<option value="-1">请选择...</option>
							<volist name="list_area" id="v">
								<option value="{$v.area_id}" <if condition="$row['area_id'] eq $v['area_id']">selected="selected"</if>>{$v.area_name}</option>
							</volist>
						</select>
	            	</empty>
	            </div>
	        </div>
	        <div class="ui-form-item ui-border-b">
	            <label class="ui-border-r">详细地址:</label>
	            <input type="text" name="address" id="address" placeholder="请输入地址" value="{$row.address|default=''}">
	        </div>
	        <div class="ui-form-item ui-border-b">
	            <label class="ui-border-r">邮政编码:</label>
	            <input type="text" name="code" id="code" placeholder="请输入邮编" maxlength="6" value="{$row.code|default=''}">
	        </div>
	        <div class="ui-form-item ui-form-item-switch ui-border-b">
	            <p>设为默认地址</p>
	            <if condition="$data.count eq 0">
	            	<label class="ui-switch m_setting m_settinged">
		                <input type="checkbox" name="default" id="default" checked>
		            </label>
	            <else />
	            	<label class="ui-switch m_setting <eq name='row.default' value='1'>m_settinged</eq>">
		                <input type="checkbox" name="default" id="default" <eq name='row.default' value='1'>checked</eq>>
		            </label>
	            </if>
	        </div>
		</div>
	</section>
</block>
<block name="script">
	<script type="text/javascript">
		var province = '';
		var city = '';
		var area = '';
		$('#js_province_box').on('change', 'select', function(event) {
			if ($(this).val()) {
				$('#js_city_box').css('display', 'block').children('.m_select').html('正在加载城市数据...');
				$.get("{:U('city')}", {
					pro_id: $(this).val()
				}, function(r) {
					if (r.status) {
						var html = '<select id="city_id" name="city_id"><option value="">请选择...</option>';
						$.each(r.list, function(index, value) {
							city = index == 0 ? value.area_id : city;
							html += '<option value="' + value.area_id + '">' + value.area_name + '</option>';
						});
						html += '</select>';
						$('#js_city_box>.m_select').html(html).children('select').val(city).change();
					} else {
						$('#js_city_box').css('display', 'none').children('.m_select').html('正在加载城市数据...');
					}
				}, 'json');
			} else {
				$('#js_city_box').css('display', 'none').children('.m_select').html('正在加载城市数据...');
			};
			$('#js_area_box').css('display', 'none').children('.m_select').html('正在加载区域数据...');
		});

		$('#js_city_box').on('change', 'select', function(event) {
			if ($(this).val()) {
				$('#js_area_box').css('display', 'block').children('.m_select').html('正在加载区域数据...');
				$.get("{:U('city_area')}", {
					city_id: $(this).val()
				}, function(r) {
					if (r.status) {
						var html = '<select id="area_id" name="area_id"><option value="">请选择...</option>';
						$.each(r.list, function(index, value) {
							area = index == 0 ? value.area_id : area;
							html += '<option value="' + value.area_id + '">' + value.area_name + '</option>';
						});
						html += '</select>';
						$('#js_area_box>.m_select').html(html).children('select').val(area).change();
					} else {
						$('#js_city_box').css('display', 'none').children('.m_select').html('正在加载城市数据...');
					}
				}, 'json');
			} else {
				$('#js_area_box').css('display', 'none').children('.m_select').html('正在加载区域数据...');
			};
		});

		$('body').on('click', '.bt_rtext', function() {
			var id = $('#id').val(),
				js_name = $('#name').val(),
				js_phone = $('#phone').val(),
				js_address = $('#address').val(),
				js_zipcode = $('#code').val()
				pro_id = $('#pro_id').val(),
				city_id = $('#city_id').val(),
				area_id = $('#area_id').val(),
				default_address = $('.m_settinged').length,
				order_type = $('#order_type').val();
			
			if(js_name.length == 0){
				$.tips({content:'姓名不能为空！',stayTime:2000,type:"success"});
				return false;
			}
			if(js_phone.length == 0){
				$.tips({content:'联系电话不能为空！',stayTime:2000,type:"success"});
				return false;
			}
			if(pro_id == -1){
				$.tips({content:'请选择省市！',stayTime:2000,type:"success"});
				return false;
			}
			if(js_address.length == 0){
				$.tips({content:'地址不能为空！',stayTime:2000,type:"success"});
				return false;
			}
			var el = '';
			$.ajax({
				url: "{:U('save_address')}",
				type: "POST",
				data: {
					id: id,
					name: js_name,
					phone: js_phone,
					address: js_address,
					code: js_zipcode,
					pro_id: pro_id,
					city_id: city_id,
					area_id: area_id,
					default_address: default_address,
					order_type: order_type
				},
				dataType: "json",
				beforeSend: function(){
					el = $.loading({content:'加载中...'})
				},
				success: function(r){
					el.loading("hide");
					if (r.status) {
						window.location.href = r.url;
					} else {
						alert(r.info);
					}
				}
			});
		}).on('change', '.m_setting input[type="checkbox"]', function(event) {
			if ($(this).prop('checked')) {
				$(this).parent().addClass('m_settinged');
			} else {
				$(this).parent().removeClass('m_settinged');
			};
		});

	</script>
</block>
